@import './variables';

// pc项目迁移
.page {
  .el-table{
    td, th{
      padding: 2px 0;
    }
  }

  .el-checkbox{
    margin: 0;
  }

  .el-textarea textarea{
    padding: 7px 10px;
  }

  .el-form label{
    font-weight: 500;
    color: #444;
  }

  .el-form-item{
    margin: 10px;
  }

  .el-form-item:last-child{
    margin-bottom: 0;
  }

  .el-select{
    width: 100%;
  }

  a.el-button{
    text-decoration: none;
  }

  .el-dialog{
    .el-dialog__close{
      font-size: 18px;
      color: #666;
    }

    .el-dialog__header{
      padding: 8px 10px;
      border-bottom: 1px solid #f4f4f4;
      display: flex;
      justify-content: space-between;
    }

    .el-dialog__headerbtn {
      position: relative;
      top: unset;
      bottom: unset;

      background: transparent;
      border: none;
      cursor: pointer;
      outline: none;

      font-size: 16px;
    }

    .el-dialog__body{
      padding: 10px;
    }

    .el-dialog__footer{
      border-top: 1px solid #f4f4f4;
    }
  }

  .el-date-editor {
    padding: 3px 5px;

    .el-range-separator{
      line-height: 24px ;
      box-sizing: content-box;
      padding: 0 3px;
    }

    .el-input__icon{
      line-height: 24px;
    }
  }

  .form-item {
    .el-date-editor--daterange.el-input__inner {
      width: 100% !important;
    }
  }
}

// 次要按钮3
button.el-button.el-button--plain-third[type=button] {
  color: #595959;
  background: #F5F8FA;
  border-radius: 4px;
  border: 1px solid #CBD6E2;
  font-size: 0;
  padding: 8px 15px;
  span {
    font-size: 14px;
  }
  &:hover {
    color: $color-primary-light-6;
    background-color: #F5F8FA;
    border-color: $color-primary-light-6;
  }

  &:active {
    color: #08979C;
    background-color: #F5F8FA;
    border-color: #0F9A9E;
  }

  &.is-disabled {
    color: #BFBFBF;
    background-color: #F5F8FA;
    border: 1px solid #BFBFBF;
    cursor: not-allowed;
  }
  .iconfont {
    font-size: 14px;
    margin-right: 8px;
  }
}
button.el-button.el-button--plain-third[type=button].el-button--mini {
  padding: 7px 15px;
  span {
    font-size: 12px;
  }
}

// ai摘要按钮
button.el-button.el-button--ai[type=button] {
  height: 32px;
  // width: 95px;
  color: #595959;
  background: #F5F8FA;
  border-radius: 4px;
  border: 1px solid #CBD6E2;
  font-size: 14px;
  padding: 5px 16px;
  line-height: 22px;
  font-weight: 400;
  i {
    background: linear-gradient(138deg, #B0FF38 5%, #2FDBB5 48%, #1B98FF 101%);
    background-clip: text;
    -webkit-background-clip: text; /* 兼容性设置 */
    color: transparent; /* 将文字设为透明 */
  }
  &:hover {
    color: $color-primary-light-6;
    background-color: #F5F8FA;
    border-color: $color-primary-light-6;
  }

  &:active {
    color: #08979C;
    background-color: #F5F8FA;
    border-color: #0F9A9E;
  }

  &.is-disabled {
    color: #BFBFBF;
    background-color: #F5F8FA;
    border: 1px solid #BFBFBF;
    cursor: not-allowed;
  }
}

// input
.el-input__inner{
  padding-left: 10px;
}

.el-input-group__append button.el-button,
.el-input-group__append div.el-select .el-input__inner,
.el-input-group__append div.el-select:hover .el-input__inner,
.el-input-group__prepend button.el-button,
.el-input-group__prepend div.el-select .el-input__inner,
.el-input-group__prepend div.el-select:hover .el-input__inner {
  border-top-left-radius: 0;
  border-bottom-left-radius: 0;
  height: 32px;
}

.el-input-group__append, .el-input-group__prepend {
  border-radius: 5px;
}

.el-input-group {
  .el-input-group__prepend:first-child {
    background-color: $--color-white !important;
    border-color: $border-color-base;
    border-top-right-radius: 0;
    border-bottom-right-radius: 0;
  }
}

// drop-down-menu
body.theme-default ul.el-dropdown-menu .el-dropdown-item {
  font-weight: normal;
  &:hover {
    background: $color-primary-light-1;
    color: $color-primary-light-6;
  }
}

// form
.el-form-item {
  &::before {
    content: '' !important;
  }
}

// select
.el-select-dropdown {
  z-index: 100000 !important;
}

.open-data-input{
  padding-right: 32px;
  width: 100%;
  cursor: pointer;
  padding: 3px 10px;
  line-height: 24px;
  min-height: 32px;
  border: 1px solid #e0e1e2;
  border-radius: 4px;
  margin: 0;
  outline: none;
  color: #333 !important;
  transition: border-color 0.2s cubic-bezier(0.645, 0.045, 0.355, 1);
  .placeholder-text {
    color: #b3b7c1;
    font-size: $font-size-base;
    line-height: 20px;
  }
}

.el-select-user-single {
  .el-select-dropdown {
    width: 100%;
    max-width: 300px;
  }
}

.el-select {
  .open-data-input {
    display: flex;
    justify-content: space-between;
    max-height: 32px;
    align-items: center;
    i {
      color: #c0c4cc;
      font-size: 14px;
    }
  }
}

// step
.el-step__head.is-success .el-step__icon.is-text,
.el-step__line,
.el-step__description.is-success {
  border-color: $color-primary;
}

.el-step__title.is-success,
.el-step__head.is-success .el-step__icon.is-text,
.el-step__line,
.el-step__description.is-success {
  @include fontColor();
}

.el-step__title {
  font-size: $font-size-base;
}

.el-step__head.is-wait .el-step__icon.is-text {
  background-color: $bg-color-l3;
  border-color: $bg-color-l3;
  i {
    color: $text-color-gray;
  }
}

// table
.el-table--small th, .el-table--small td {
  padding: 6px 0;
}

.el-table__fixed,
.el-table__fixed-right {
  &::before {
    height: 0 !important;
  }
}

.el-table--border {
  &::after {
    width: 0 !important;
  }
}

.el-table__body .el-table__row td,
.el-table__header thead tr th {
  padding: 0;
  .cell {
    height: 40px;
    line-height: 40px;
    align-items: center;
  }
}

.base-notification{
  z-index: 9999 !important;
  padding: 14px !important;

  .el-notification__group{
    flex: 1;
  }

  .el-notification__title{
    padding-right: 24px;
  }

  .el-notification__content{
    max-height: 360px;
    overflow-y: auto;
    margin-right: 20px;
  }

  h3{
    font-size: 16px;
    margin: 0;
    padding: 10px 0 5px 0;
  }
}

.el-form-item.is-success .el-input__inner,
.el-form-item.is-success .el-input__inner:focus,
.el-form-item.is-success .el-textarea__inner,
.el-form-item.is-success .el-textarea__inner:focus,
.el-step__head.is-success .el-step__icon.is-text,
.el-step__line,
.el-step__description.is-success {
  border-color: $color-primary;
}

.el-step__title.is-success,
.el-step__head.is-success .el-step__icon.is-text,
.el-step__line,
.el-step__description.is-success {
  @include fontColor();
}

.el-step__title {
  font-size: $font-size-base;
}

.el-step__head.is-wait .el-step__icon.is-text {
  background-color: $bg-color-l3;
  border-color: $bg-color-l3;
  i {
    color: $text-color-gray;
  }
}
.el-radio-button {
  user-select: none;
}
.el-radio-button.is-active {
  box-shadow: none !important;
}
.el-select-dropdown {
  z-index: 100000 !important;
}

.el-form-item.is-required.el-form-item {
  &::before {
    content: '';
  }
}

.el-button--small {
  font-size: $font-size-base;
}

.el-select-dropdown{
  max-width: 465px;
}
.el-cascader-menu{
  max-width: 220px;
  .el-cascader-menu__item div{
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }
}
.list-wrapper {
  max-width: calc(100vw - 20px);
}

.el-picker-panel {
  z-index: 6000 !important;
}

.el-input-group__append {
  border-color: $color-primary;
  overflow: hidden;
  .el-button {
    border-radius: 1px;
  }
}

.el-drawer__close-btn {
  outline: none;
  padding: 0;
  margin-left: 12px;
}

.el-table {
  padding-top: 0 !important;
  padding-bottom: 0 !important;
}

.el-dropdown {
  color: $text-color-regular;
}

.el-input.is-disabled .el-input__inner,
.el-textarea.is-disabled .el-textarea__inner {
  background-color: $bg-color-l1 !important;
  border-color: #D9D9D9 !important;
}

.el-message-box__wrapper {
  z-index: 99999999 !important;
}

.el-message__icon.el-icon-info{
  color: $--color-primary !important;
}

.el-dropdown-menu__item:not(.is-disabled):hover,
.el-dropdown-menu__item:focus {
  background-color: $--color-primary-light-9;
}

.el-alert.el-alert--success {
  border: 1px solid $--color-success-light-6;
}

.el-alert.el-alert--warning {
  border: 1px solid $--color-warning-light-6;
}

.el-alert.el-alert--danger {
  border: 1px solid $--color-danger-light-6;
}

.el-alert.el-alert--info {
  background-color: $--color-primary-light-9;
  border: 1px solid $--color-primary-light-6;
}

.el-message.el-message--info {
  background-color: $--color-primary-light-9;
  border: 1px solid $--color-primary-light-6;
  .el-message__content {
    color: #595959;
  }
}

.el-picker-panel.el-date-range-picker {
  .in-range div {
    &:hover {
      color: $--color-primary;
    }
  }
  .in-range.start-date div,
  .in-range.end-date div{
    &:hover {
      color: $--color-white;
    }
  }
}

.el-scrollbar__wrap::-webkit-scrollbar {
  width: 10px; 
  height: 10px; 
}

.ganteview,
.gante-table-box,
.role-view-user-table,
.el-table {
  
  &::-webkit-scrollbar {
    width: 10px !important;
    height: 10px !important;
  }
  
  .el-table__body-wrapper::-webkit-scrollbar {
    width: 10px !important;
    height: 10px !important;
  }
  
  .el-table__body-wrapper::-webkit-scrollbar-track{
    background-color: transparent;
  }
  
  .el-table__body-wrapper::-webkit-scrollbar-thumb {
    background-color: #bfbfbf;
  }
  
  .el-table__body-wrapper::-webkit-scrollbar-thumb:hover {
    background-color: #8C8C8C;
  }
  
}
.el-select .el-input.is-focus .el-input__inner {
  border-color: $color-primary;
}
.el-radio.is-bordered.is-checked {
  border-color: $color-primary;
}
.el-radio__input.is-checked .el-radio__inner {
  border-color: $color-primary;
  background: $color-primary;
}
.el-checkbox__inner:hover {
  border-color: $color-primary;
}
.el-checkbox__input.is-focus .el-checkbox__inner {
  border-color: $color-primary;
}
.el-checkbox__input.is-indeterminate .el-checkbox__inner {
  border-color: $color-primary;
}
.el-tag {
  color: $color-primary;
  background-color: $color-primary-light-1;
  border-color: $color-primary-light-2;
}
.el-radio-button__orig-radio:checked + .el-radio-button__inner {
  border-color: $color-primary;
}
.el-range-editor.is-active {
  border-color: $color-primary;
}
.el-select .el-input__inner:focus {
  border-color: $color-primary;
}
.el-tabs__item:focus.is-active.is-focus:not(:active) {
  box-shadow: 0 0 2px 2px $color-primary inset;
}
button.el-button.el-button--plain-third[type=button]:active {
  color: $color-primary-light-6;
  border-color: $color-primary-light-5;
}
.el-radio__inner:hover {
  border-color: $color-primary;
}
.el-upload-dragger:hover {
  border-color: $color-primary;
}
.el-message {
  min-width: auto;
  width: auto;
}